今天要來做第二張網美照，圓形圓形圓形結合透明度加標題結束!這次沒用到什麼特別的技術，都是之前提到過的筆記，像是在Day04的時候提到的圓形，以及昨天提到的文字功能，透過這些功能來完成今天的設計。
所以來寫一個不想被擋住就用z-index決定前後位置和opacity的透明功能。
當我們開始加入多種元素進入網頁時，有時候可能要區分誰上誰下來避免被遮住的情況，除了按照網頁順序寫下來的默認排序，也可以利用z-index來做調整，還記得在Day05的時候有畫出Z軸的方向，參數越大表示月上層，相對的參數越小表示越下層。
下面示範是碰觸的元件會變到第一層：
codepen點這
透明化顧名思義就是字面意思將元素加上透明效果，是利用opacity，參數0為完全透明，而參數1則是完全不透明，其餘透明程度則是填入介於0與1之間。
下面示範是觸碰到的元件不透明化：
codepen點這
CSS z-index 的用法與最大值、最小值 - 架站盒子
CSS的z-index－決定元素的堆疊順序 - 網頁設計
iThome鐵人賽
看影片追技術